<template>
    <div id="Circumstance"> 
        <div class="header"><img class="return_img" src="@/assets/Return.png" style="width:.23rem;height:.4rem;" v-on:click="back">账单详情</div>     
        <div class="circumstance">
            <div class="circumstance_top">
                <p><img src="@/assets/GoldCoin.png" alt="" width='51'></p>
                <div class="font18">剩余收益提现-到{{ userInfo.nickName  }}</div>
                <span>{{ userInfo.num  }}</span>
            </div>
            <div class="circumstance_bottom">
                <ul>
                    <li>
                        <p class="left">当前状态</p>
                        <span class="left active" v-if="userInfo.status == 1">审核中</span>
                        <span class="left active2" v-if="userInfo.status == 2">提现成功</span>
                        <span class="left active3" v-if="userInfo.status == 3">审核中</span>
                        </li>
                    <li><p class="left">提现金额</p><span class="left">￥{{ userInfo.num  }}</span></li>
                    <li><p class="left">申请时间</p><span class="left">{{ userInfo.formatTime }}</span></li>
                    <li><p class="left">提现账号</p><span class="left">{{ userInfo.nickName }}</span></li>
                    <li><p class="left">提现单号</p><span class="left">{{ userInfo.content  }}</span></li>
                </ul>
            </div>
        </div>
    </div>
</template>
<script>
import { XHeader } from 'vux'
export default {
    components:{ XHeader },
    data(){
        return{
            userInfo: JSON.parse(localStorage.getItem('userInfo')),
            nickName: localStorage.nickName,
        }
    },
    created(){
        console.log(this.userInfo)
    },
    methods:{
        back(){
            this.$router.go(-1);//返回上一层
        },
    }
}
</script>
<style scoped lang="less">
#Circumstance{
    .circumstance{
        padding: 0 25px;
        background: #fff;
        .circumstance_top{
            height: 203px;
            text-align: center;
            padding-top: 23px;
            border-top: 1px solid #D8D8D8;
            border-bottom: 1px solid #D8D8D8;
            color: #000000;
            div{
                margin: 17px 0 21px 0;              
            }
            span{
                font-size: 30px;
            }
        }
        .circumstance_bottom{
            ul{
                li{
                    height: 50px;
                    line-height: 50px;
                    p{
                        margin-right: 21px;
                    }
                     .active{
                        color:#666666;
                    }
                    .active2{
                        color:#2FC701;
                    }
                    .active3{
                        color:#FD382F;
                    }
                }
            }
        }
    }
    
}
</style>
